import * as tools from '../tools';

const loginInfo = sessionStorage.getItem('loginInfo');
let loginObj = null;
if (loginInfo) {
    loginObj = JSON.parse(loginInfo);
}

const menu = {
    'index': {
        page: 'index.html',
        text: '首页'
    },
    'api': {
        page: 'api.html',
        text: '接入API'
    },
    'login': {
        page: 'login.html',
        text: '管理中心',
        className : 'login2'
    },
    'vedio': {
        page: 'vedio.html',
        text: '培训视频'
    },
    'help': {
        page: 'help.html',
        text: '帮助中心'
    },
};

function renderLoginInfo() {
    let loginHtml = '';
    if (loginInfo) {
        loginHtml += `
            <li>
                <a href="${tools.loginUrl + loginObj.sessionID}">进入开放平台</a>
            </li>
            <li class="add_dr">
                <a class="loginOut">注销</a>
            </li>
            <li class="back_home">
                <a href="/">返回官网</a>
            </li>
        `
    } else {
        loginHtml += `
        <li>
            <a class="login" href="./login.html">登录</a>
        </li>
        <li class="add_dr">
            <a href="./register.html">注册</a>
        </li>
 
        <li class="back_home">
            <a href="/">返回官网</a>
        </li>
    `
    }

    return loginHtml
}

function renderLink(path) {
    let lis = '';
    for (var p in menu) {
        if (p == path) {
            lis += `<li class="active"><a >${menu[p].text}</a></li>`
        } else {
            if(menu[p].text == '培训视频') {
                lis += `<li><a class="videoCheck">${menu[p].text}</a></li>`
            }else {
                lis += `<li><a class="${menu[p].className ? menu[p].className : ''}" href="${menu[p].page}">${menu[p].text}</a></li>`
            }
        }
    }
    return lis
}

function initHeaderFooter(path = '') {
    let lihtml = renderLink(path);
    let rightHtml = renderLoginInfo();
  
    $('.g-header-wrap').html(` 
    <div class="g-header-left">
        <div class="g-log">
            <img src="../src/images/logo.png" alt="">
        </div>
    </div>
    <div class="g-header-right row">
        <div class="g-header-right-t col-sm-8">
            <ul class="g-nav list-inline">
                <div class="g-line-btm"></div>
                ${lihtml}
            </ul>
        </div>
    <div class="g-header-right-menue col-sm-4">
        <ul class="g-menue list-inline pull-right">
            ${rightHtml}
        </ul>
    </div>
</div>`);

    $('.footer_').html(`
        <div>联系我们</div>
        <div>
            <span>chenxiaohua7@gome.com.cn</span>
        </div>
        <a>2014 - 2018 安迅物流有限公司 版权所有 京ICP备15007956号</a>
    `)
    

    $(document).on('click', '.loginOut', function() {
        sessionStorage.removeItem('loginInfo');
        location.href = './index.html';
    })
    $(document).on('click', '.login2', function(e) {
        e.preventDefault();
        sessionStorage.setItem('loginPage', 'login');
        console.log('loginInfo', loginInfo)
        if(loginInfo) {
            location.href = tools.loginUrl + loginObj.sessionID;
        }else {
            location.href = './login.html';
        }
    })

    $(document).on('click', '.login', function(e) {
        e.preventDefault();
        sessionStorage.setItem('loginPage', 'login');
        if(loginInfo) {
            location.href = tools.loginUrl + loginObj.sessionID;
        }else {
            location.href = './login.html';
        }
    })

    $(document).on('click', '.videoCheck', function() {
        if (loginInfo) {
            location.href = './vedio.html';
        }else {
            sessionStorage.setItem('loginPage', 'video');
            location.href = './login.html'
        }
    })

    $('.g-nav li').hover(function () {
        let $trg = $('.g-line-btm');
        let pos = $(this).offset().left - $('.g-nav').offset().left;
        $trg.css({
            left: ($(this).outerWidth() - 40) / 2 + pos + 5 + 'px'
        })
    }, function () {
        let $trg = $('.g-line-btm');
        $trg.css({
            left: '-100px'
        })
    })
};

export {
    initHeaderFooter
}